import React, { Component, PropTypes } from 'react';
import { connect } from 'react-redux'
import { Button, Icon } from 'antd'
import { messages } from "share/common"
import SlideFrame from "share/openSlideFrame";
import menuRoute from 'routes/menuRoute'
import Info from 'components/info'
import AdvancedTable from 'components/advanced-table'
import DefaultInfo from './slide-frame-default-info'

import Condition from 'components/condition'

const { SimpleTable } = AdvancedTable;
const { If } = Condition;

class TableListDetail extends Component {
  state = {
    loading: false,
  };

  handleRowClick = record => {
    const { subPageInfo, slideFrameInfo, afterClose } = this.props;
    //点击行信息时跳转页面
    if (record && subPageInfo) {
      let url = menuRoute.getPageUrlByKey(subPageInfo.key);
      subPageInfo.replaceParams && subPageInfo.replaceParams.map(key => url = url.replace(`:${key}`, record[key]));
      this.context.router.push(url);
      return
    }
    if (!slideFrameInfo) return;
    const { title, content, params } = slideFrameInfo;
    SlideFrame.openSlideFrame({
      title,
      content,
      params: {
        record: record || {},
        ...(params || {})
      },
      afterClose
    }, this);
  };

  openDefaultRule = () => {
    const { defaultInfo } = this.props;
    const { title, data } = defaultInfo;
    SlideFrame.openSlideFrame({
      title,
      content: DefaultInfo,
      params: { data },
    }, this);
  };

  render() {
    const { infoData, tableParams, slideFrameInfo, defaultInfo, disabledEdit, more, title, children } = this.props;
    let attributes = infoData && infoData.attributes && infoData.attributes.map(i => {i.widthFix = false; return i;});
    return (
      <SimpleTable
        {...tableParams}
        show={['tag-list', 'table-utils']}
        onRow={record => ({
          onClick: () => this.handleRowClick(record)
        })}
      >
        {children}
        {infoData && (
          <Info paragraph title={title} dataSource={infoData.dataSource} attributes={attributes}/>
        )}
        {infoData && infoData.more}
        <div style={{ margin: '12px 0', lineHeight: '32px', overflow: 'hidden' }}>
          <If value={slideFrameInfo && !disabledEdit}>
            <Button type="primary" onClick={() => this.handleRowClick()}>
              {messages('common.create')/*新建*/}
            </Button>
          </If>
          <If value={more}>
            {more}
          </If>
          <If value={defaultInfo}>
            <a style={{ float: 'right' }} onClick={this.openDefaultRule}>
              <Icon type="file-text"/> {messages('expense-2.key47')/*默认规则*/}
            </a>
          </If>
        </div>
      </SimpleTable>
    )
  }

  static propTypes = {
    infoData: PropTypes.object,
    slideFrameInfo : PropTypes.object,
    tableParams: PropTypes.object,
    defaultInfo: PropTypes.object,
    disabledEdit: PropTypes.bool,
    more: PropTypes.any,
    afterClose: PropTypes.func,
  };

  static defaultPropTypes = {
    afterClose: () => {}
  };

}

TableListDetail.contextTypes = {
  router: React.PropTypes.object
};

function mapStateToProps(state) {
  return { }
}

export default connect(mapStateToProps)(TableListDetail)
